'use strict';
import React, {Component} from 'react';
import {
    StyleSheet,
    View,
    Text,
    Image,
    TouchableOpacity,
} from 'react-native';
import Global from '../Commom/GlobalConst';
import SettingContainer from '../Containers/SettingContainer';
import MyTravelPage from './MyTravelPage';
import MyAccountSettingsContainer from '../Containers/MyAccountSettingsContainer';
import MyQuestionAnswerPage from './MyQuestionAnswerPage';
import MyHelpToBuyPage from './MyHelpToBuyPage';
import MyDatingPartnerPage from './MyDatingPartnerPage';
import MyCollectionPage from './MyCollectionPage';
import RegisteredContainer from '../Containers/RegisteredContainer';
import {UserFromStorage} from '../Action/UserAction';
export default class MinePage extends Component {
    constructor(props) {
        super(props);
        this.state = {
            userName: '请先登录',
        }
        this.headStatusBar = this.headStatusBar.bind(this);
    }

    componentDidMount() {
        const {dispatch} = this.props;
        dispatch(UserFromStorage())
    }

    ClickAction(number) {
        const {UserReducer}=this.props;
        switch (number) {
            case 0:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'SettingContainer',
                        component: SettingContainer,
                        passProps: {},
                    });
                }
                break;
            case 1:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyAccountSettingsContainer',
                        component: MyAccountSettingsContainer,
                        passProps: {
                            phone:UserReducer.phone,
                            user_name:UserReducer.user_name,
                            head_picture:UserReducer.head_picture,
                        },
                    });
                }
                break;
            case 3:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyQuestionAnswerPage',
                        component: MyQuestionAnswerPage,
                        passProps: {},
                    });
                }
                break;
            case 4:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyTravelPage',
                        component: MyTravelPage,
                        passProps: {},
                    });
                }
                break;
            case 5:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyHelpToBuyPage',
                        component: MyHelpToBuyPage,
                        passProps: {},
                    });
                }
                break;
            case 6:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyDatingPartnerPage',
                        component: MyDatingPartnerPage,
                        passProps: {},
                    });
                }
                break;
            case 7:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyCollectionPage',
                        component: MyCollectionPage,
                        passProps: {},
                    });
                }
                break;
            case 8:
                break;
            case 9:
                if (UserReducer.isLoggedIn === false) {
                    this.props.navigator.push({
                        id: 'RegisteredContainer',
                        component: RegisteredContainer,
                        passProps: {},
                    });
                } else {
                    this.props.navigator.push({
                        id: 'MyAccountSettingsContainer',
                        component: MyAccountSettingsContainer,
                        passProps: {
                            phone:UserReducer.phone,
                            user_name:UserReducer.user_name,
                            head_picture:UserReducer.head_picture,
                        },
                    });
                }
                break;
        }
    }

    headStatusBar() {
        const {UserReducer}=this.props;
        if (UserReducer.isLoggedIn === false) {
            return (
                <View
                    style={{width:Global.Const.size.width,height:210,alignItems:'center'}}>
                    <Image style={{width:Global.Const.size.width,height:210,position: 'absolute',left: 0,top: 0}}
                           source={require('../../Image/mine_bg1.png')}></Image>
                    <TouchableOpacity activeOpacity={0.5}
                                      onPress={()=>this.ClickAction(9)}>
                        <View style={{width:100,height:100,borderRadius:50,marginTop:60}}>
                            <Image style={{resizeMode:'contain',width:100,height:100,borderRadius:50}}
                                   source={require('../../Image/icon_not_logged.png')}></Image>
                        </View>
                    </TouchableOpacity>
                    <Text
                        style={{marginTop:8,fontSize:16,color:'white',backgroundColor:'rgba(0,0,0,0)'}}>{this.state.userName}</Text>
                    <View style={{width:28,height:28,position: 'absolute',right: 5,top: 30}}>
                        <TouchableOpacity activeOpacity={0.5}
                                          onPress={()=>this.ClickAction(0)}>
                            <Image style={{resizeMode:'contain',width:20,height:20}}
                                   source={require('../../Image/icon_setting.png')}></Image>
                        </TouchableOpacity>
                    </View>
                </View>
            )
        } else {
            return (
                <View
                    style={{width:Global.Const.size.width,height:210,alignItems:'center'}}>
                    <Image style={{width:Global.Const.size.width,height:210,position: 'absolute',left: 0,top: 0}}
                           source={require('../../Image/mine_bg1.png')}></Image>
                    <TouchableOpacity activeOpacity={0.5}
                                      onPress={()=>this.ClickAction(8)}>
                        <View style={{width:100,height:100,borderRadius:50,marginTop:60}}>
                            <Image style={{width:100,height:100,borderRadius:50}}
                                   source={{uri: UserReducer.head_picture}}></Image>
                        </View>
                    </TouchableOpacity>
                    <Text
                        style={{marginTop:8,fontSize:19,color:'white',backgroundColor:'rgba(0,0,0,0)'}}>{UserReducer.user_name}</Text>
                    <View style={{width:28,height:28,position: 'absolute',right: 5,top: 30}}>
                        <TouchableOpacity activeOpacity={0.5}
                                          onPress={()=>this.ClickAction(0)}>
                            <Image style={{resizeMode:'contain',width:20,height:20}}
                                   source={require('../../Image/icon_setting.png')}></Image>
                        </TouchableOpacity>
                    </View>
                </View>
            )
        }
    }

    render() {
        return (
            <View style={styles.container}>
                {this.headStatusBar()}
                <TouchableOpacity activeOpacity={0.5}
                                  onPress={()=>this.ClickAction(1)}>
                    <View
                        style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor:Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>
                        <Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>账号设置</Text>
                        <View style={{flex: 1,alignItems: 'flex-end'}}>
                            <Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}
                                   source={require('../../Image/icon_go.png')}></Image>
                        </View>
                    </View>
                </TouchableOpacity>

                <TouchableOpacity activeOpacity={0.5}
                                  onPress={()=>this.ClickAction(3)}>
                    <View
                        style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>
                        <Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的问答</Text>
                        <View style={{flex: 1,alignItems: 'flex-end'}}>
                            <Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}
                                   source={require('../../Image/icon_go.png')}></Image>
                        </View>
                    </View>
                </TouchableOpacity>
                {/*<TouchableOpacity activeOpacity={0.5}*/}
                                  {/*onPress={()=>this.ClickAction(4)}>*/}
                    {/*<View*/}
                        {/*style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>*/}
                        {/*<Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的游记</Text>*/}
                        {/*<View style={{flex: 1,alignItems: 'flex-end'}}>*/}
                            {/*<Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}*/}
                                   {/*source={require('../../Image/icon_go.png')}></Image>*/}
                        {/*</View>*/}
                    {/*</View>*/}
                {/*</TouchableOpacity>*/}
                <TouchableOpacity activeOpacity={0.5}
                                  onPress={()=>this.ClickAction(5)}>
                    <View
                        style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>
                        <Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的帮购</Text>
                        <View style={{flex: 1,alignItems: 'flex-end'}}>
                            <Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}
                                   source={require('../../Image/icon_go.png')}></Image>
                        </View>
                    </View>
                </TouchableOpacity>
                <TouchableOpacity activeOpacity={0.5}
                                  onPress={()=>this.ClickAction(6)}>
                    <View
                        style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>
                        <Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的约伴</Text>
                        <View style={{flex: 1,alignItems: 'flex-end'}}>
                            <Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}
                                   source={require('../../Image/icon_go.png')}></Image>
                        </View>
                    </View>
                </TouchableOpacity>
                <TouchableOpacity activeOpacity={0.5}
                                  onPress={()=>this.ClickAction(7)}>
                    <View
                        style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>
                        <Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的收藏</Text>
                        <View style={{flex: 1,alignItems: 'flex-end'}}>
                            <Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}
                                   source={require('../../Image/icon_go.png')}></Image>
                        </View>
                    </View>
                </TouchableOpacity>
                {/*<TouchableOpacity activeOpacity={0.5}*/}
                                  {/*onPress={()=>this.ClickAction(8)}>*/}
                    {/*<View*/}
                        {/*style={{backgroundColor:'white',width: Global.Const.size.width,height: 45,borderBottomWidth: 1,borderColor: Global.Const.transparent,alignItems: 'center',flexDirection: 'row'}}>*/}
                        {/*<Text style={{marginLeft:15,fontSize:14,color:Global.FontColor.DimGray}}>我的村务</Text>*/}
                        {/*<View style={{flex: 1,alignItems: 'flex-end'}}>*/}
                            {/*<Image style={{ resizeMode:'contain',marginRight: 10,width:14,height:11}}*/}
                                   {/*source={require('../../Image/icon_go.png')}></Image>*/}
                        {/*</View>*/}
                    {/*</View>*/}
                {/*</TouchableOpacity>*/}
            </View>
        );
    }
}

var styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: Global.Const.transparent,
    },
});